<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>article build</title>
<link rel="stylesheet" href="/networkforum/css/base.css" />
<link rel="stylesheet" href="/networkforum/css/article_build.css" />
<link rel="stylesheet" href="/networkforum/js/ueditor/themes/default/ueditor.css" />
<script type="text/javascript" src="/networkforum/js/ueditor/editor_config.js"></script>
<script type="text/javascript" src="/networkforum/js/ueditor/editor.js"></script>
<!–[if lt IE9]> 
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]–>
<script type="text/javascript">
function create(){
	var title = document.getElementById("title").value;
	if(title.value==""||title.value == "标题"){
		alert("博客标题不能为空");
		return;
	}
	var editorValue = editor.getContent();
	if(editorValue == ""||editorValue.length<100){
		alert("编辑内容太简单");
		return;
	}
	var group = document.getElementById("group").value;
	if(group == ""||group=="点击选择"){
		alert("点击选择分类");
		return;
	}
	document.getElementById("editorValue").value = editorValue;
	var form = document.getElementById("form");
	form.submit();
}
function getGroups(){
	var myajax = getByAjax();
	myajax.init(null,"get",true);
	myajax.get("/networkforum/article/article_group.do",groupInit);	
	myajax = null;
	document.getElementById("group").onclick = null;
	document.getElementById("group").onmouseover = showGroup;
}
function showGroup(){
	var groupInner = document.getElementById("groupInner");
	groupInner.style.display = "";
}
function groupInit(d){
	var groupInner = document.getElementById("groupInner");
	//var data = eval("("+d+")");
	var data = toJson(d);
	var groupUl = document.getElementById("groupUl");
	if(data.length==0){
		var li = document.createElement("li");
		li.innerHTML = "--无分组--";
		li.style.disabled = "none";
		groupUl.appendChild(li);
	}
	else{
		var frag = document.createDocumentFragment();
		for(var i =0;i<data.length;i++){
			var li = document.createElement("li");
			li.innerHTML = data[i]['groupName'];
			li.groupId = data[i]['groupId'];
			frag.appendChild(li);
			li.onclick = function(event){
				var e = event || window.event;
				var target = e.target;
				document.getElementById("group").value = target.innerHTML;
				groupInner.style.display = "none";
			}
		}
		groupUl.innerHTML = "";
		groupUl.appendChild(frag);
	}
	groupInner.style.display = "";
	
}
function showCreate(obj){
	if(obj.innerHTML == "关闭"){
		obj.innerHTML = "新建分类";
		document.getElementById("createGroupInner").style.display = "none";
	}
	else{
		obj.innerHTML = "关闭";
		document.getElementById("createGroupInner").style.display = "";
	}
}
function createGroup(){
	var groupName = document.getElementById("newGroupName");
	if(groupName.value == ""){
		alert("组名不能为空!");
		return;
	}
	var myajax = getByAjax();
	myajax.init(null,"get",true);
	myajax.get("/networkforum/article/create_group.do?groupName="+encodeURIComponent(groupName.value),function(d){
		document.getElementById("createGroupInner").style.display = "none";
		document.getElementById("createGroup").innerHTML = "新建分组";
		groupName.value = "";
		document.getElementById("group").onclick = getGroups;
		alert("创建成功！");
	});	
	myajax = null;
}
function addTitle(){
	var title = document.getElementById("title");
	if(title.value == "标题"){
		title.value = "";
	}
}
</script>
</head>

<body>
<iframe id="tnav" class="tnav" src="/networkforum/pages/user/user_header.html"></iframe>
<section class="articleBuild">
    <header class="abheader">
    	<h2>赶快来创建自己的博客吧！</h2>
    </header>
	<!--<nav class="abnav">
    	 <h2>创建博客</h2> 
        <label onclick="javascript:history.go(-1);">返回</label>
    </nav>-->
    <form id="form" action="/networkforum/article/create_article.do" method="post">
	    <input id="title" onfocus="addTitle();" class="title" name="title" type="text" value="标题" />
	    <input id="editorValue" name="editorValue" style="display: none;"/>
	    <!--<iframe class="editor" scrolling="no" src="../editor/editor.html"></iframe>
	    <iframe class="ueditor" scrolling="no" src="/networkforum/js/ueditor/index.html"></iframe>
	    -->

	    <div id="editor" name="editorValue" style="width:100%;"></div>
		
		<script type="text/javascript">
		    var editor = new UE.ui.Editor();
		    editor.render('editor');
		</script>

	    <section class="articleInfo">
	    	<h2>提供关键字，可以让别人更快的找到此篇文章（可选）</h2>
	    	<input type="text" name="keywords" class="input"/><label class="label">多个关键字用半角逗号隔开,最多五个</label>
	    	<!-- <h2>背景音乐（可选）</h2>
	    	<input type="text" name="musicurl" class="input"/><label class="label">可以从网上找一首mp3作为阅读时的背景音乐</label>
	    	 -->
	    	<h2>文章分类</h2>
	    	<input id="group" type="text" name="group" class="group" onclick="getGroups(this);" value="点击选择"/>
	    	<section id="groupInner" class="groupInner" style="display:none;">
	    		<ul id="groupUl">
	    		</ul>
	    	</section>
	    	<label id="createGroup" class="createGroup" onclick="showCreate(this);">新建分类</label>
	    	<section id="createGroupInner" style="display:none;">
		    	名称：<input id="newGroupName" type="text"/>
		    	<label onclick="createGroup();">创建</label>
	    	</section>
	    	<h2>隐私设置？</h2>
	    	<input type="radio" name="ispublic" value="all" checked="checked"/>所有人可见
	    	<input type="radio" name="ispublic" value="self"/><span>仅本人可见</span>
	    	<h2>评论设置？</h2>
	    	<input type="radio" name="isreply" value="true" checked="checked"/><span>允许评论</span>
	    	<input type="radio" name="isreply" value="false"/><span>禁止评论</span>
	    	<label class="submit" onclick="create();">发布</label>
	    </section>
    </form>
</section>
<iframe class="footer" src="../footer.html"></iframe>
</body>
<script type="text/javascript" src="/networkforum/js/myajax.js"></script>
</html>
